<template>
  <div>nihao</div>
</template>

<script>
import * as THREE from 'three';

export default {
  mounted() {
    this.init3DScene();
  },
  methods: {
    init3DScene() {
      // 创建场景
      const scene = new THREE.Scene();
      // 创建相机
      const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
      camera.position.z = 5;
      // 创建渲染器
      const renderer = new THREE.WebGLRenderer();
      renderer.setSize(window.innerWidth, window.innerHeight);
      document.getElementById('factory3D').appendChild(renderer.domElement);
      // 创建一个立方体（模拟简单物体，实际替换为工厂模型）
      const geometry = new THREE.BoxGeometry(1, 1, 1);
      const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
      const cube = new THREE.Mesh(geometry, material);
      scene.add(cube);
      // 动画循环
      function animate() {
        requestAnimationFrame(animate);
        cube.rotation.x += 0.01;
        cube.rotation.y += 0.01;
        renderer.render(scene, camera);
      }
      animate();
    },
  },
};
</script>

<style scoped>
.factory-3d-container {
  width: 100%;
  height: 500px;
}
</style>